<!--
  * @Description: 招聘-我的
  * @Author: rcc
  * @Date: 2024-08-08 11:40:04
  * @FilePath: /rc-recruitment/pages/tab-page/hiring-mine/hiring-mine.vue
-->

<template>
  <view class="page">
    <up-navbar
      title="我的"
      placeholder
      :titleStyle="titleStyle"
      bgColor="#1269FF"
    >
      <template #left>
        <view class="flex" />
      </template>
    </up-navbar>

    <view class="top-view flex-d-t p-h24 p-t30">
      <view class="flex-r flex-self-end" style="z-index: 2" @click="logout">
        <image class="square-26" src="@/static/images/mine/switch.png" />
        <text class="m-l10 text-400-226">切换求职者</text>
      </view>

      <image class="avatar m-t30" :src="userInfo?.avatar" mode="aspectFill" />

      <view class="flex m-t16">
        <text class="text-700-238">{{ userCompany?.duties }}</text>

        <view class="auth-view flex m-l10 p-h6">
          <image class="auth-bg" src="@/static/images/mine/auth-bg.png" />

          <view class="relative flex-sb">
            <image class="square-26" src="@/static/images/mine/auth.png" />
            <text class="text-400-224">{{
              isHiring ? "已认证" : "未认证"
            }}</text>
          </view>
        </view>
      </view>

      <text class="m-t20 text-700-230">{{ userCompany?.title }}</text>

      <image
        class="user-bg"
        src="@/static/images/mine/user-bg.png"
        mode="widthFix"
      />
    </view>

    <LinksView />
    <view class="text text-400-328">技术支持：优雅草科技</view>
  </view>
</template>

<script lang="ts" setup>
import LinksView from "./components/links.vue";
import { useUserStore } from "@/stores/user";
import { computed } from "vue";
const titleStyle = {
  color: "#fff",
  "font-size": "34rpx",
  "font-weight": "bold",
};

const { userInfo, isHiring } = useUserStore();
const userCompany = computed(() => useUserStore().userCompany);
console.log(userCompany, 123);
const logout = () => {
  uni.showModal({
    title: "提示",
    content: "确定要切换到求职者吗？",
    success: (res) => {
      if (res.confirm) {
        uni.navigateTo({ url: "/pages/user/login/login?role=0" });
      }
    },
  });
};
</script>

<style lang="scss" scoped>
.text {
  text-align: center;
  padding: 40rpx;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.top-view {
  position: relative;
  height: 460rpx;
  background-color: $bg-color-2;

  .user-bg {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    z-index: 1;
  }

  .auth-view {
    position: relative;
    width: 119rpx;
    height: 38rpx;

    .auth-bg {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
    }
  }
}

.avatar {
  width: 150rpx;
  height: 150rpx;
  border-radius: 50%;
  background-color: $bg-color-1;
}
</style>
